<template>
  <zeda-dialog
    v-model="visible"
    title="纠正填写"
    width="500px"
    :before-close="handleClose"
  >
    <aps-form
      :config="apsForm.formConfig"
      :model="apsForm.formData"
      :formRef="apsForm.formRef"
      :labelWidth="apsForm.labelWidth"
      ref="form"
    ></aps-form>
    <form-button
      slot="footer"
      :loading="loading"
      :submitText="'确定'"
      @cancel="handleClose"
      @submit="submit"
    >
    </form-button>
  </zeda-dialog>
</template>

<script>
import FormButton from "@/components/FormButton";
import { correctLedger } from "@/api/standingbook/newstandingbook.js";

export default {
  dicts: [],
  components: {
    FormButton,
  },
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    id: {
      type: [Number, String],
      default: "",
    },
    yearAndmonth: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      loading: false, // 按钮加载中判断
      apsForm: {
        formRef: "form",
        formData: {},
        labelWidth: "auto",
        formConfig: {
          formAttr: {
            // inline: true,
            "label-position": "right",
            size: "small",
            bsColumn: {
              col: 1,
              middle: true,
            },
            rules: {
              msg: [
                {
                  required: true,
                  message: "请输入纠正原因",
                  trigger: "blur",
                },
                {
                  validator: function (rule, value, callback) {
                    let reg = new RegExp(
                      "^(?!_)(?!.*?_$)[a-zA-Z0-9_\u4e00-\u9fa5]+$"
                    );
                    if (!reg.test(value)) {
                      callback("请勿输入特殊字符，且不能以下划线开头和结尾");
                    } else {
                      callback();
                    }
                  },
                  trigger: "blur",
                },
              ],
            },
          },
          properties: {
            msg: {
              label: "纠正原因",
              typeName: "el-input",
              type: "textarea",
              rows: 4,
              maxlength: 200,
              placeholder: "请输入纠正原因",
            },
          },
        },
      },
    };
  },
  watch: {
    visible: {
      handler(value) {
        if (value) {
          // console.log(this.id, this.yearAndmonth);
        }
      },
      deep: true,
      immediate: false,
    },
  },
  methods: {
    submit() {
      const data = {
        ...this.$refs.form.getFieldsValue(),
      };
      let params = {
        ledgerIds: [],
      };
      params.ledgerIds.push(this.id);
      params.msg = data.msg;
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.loading = true;
          this.requestCorrect(params);
        } else {
          return false;
        }
      });
    },
    // 纠正
    requestCorrect(params) {
      correctLedger(params)
        .then((res) => {
          this.loading = false;
          if (res.code === 700) {
            this.$message.warning(res.msg);
            this.handleClose(true);
            return false;
          }
          this.$router.push({
            name: "newaddAdd",
            query: {
              id: this.id,
              year: this.yearAndmonth.year,
              month: this.yearAndmonth.month,
              disabled: "0",
              correct: "1",
            },
          });
        })
        .catch(() => {
          // this.$message.error("系统错误,请联系管理员!");
        });
    },
    handleClose(status) {
      this.$refs["form"].resetFields();
      this.$emit("update:visible", false);
      this.$emit("close", status === true ? status : false);
    },
  },
};
</script>

<style scoped lang="scss">
::v-deep .el-form {
  .el-input,
  .el-cascader,
  .el-input-number,
  .el-select {
    width: 100% !important;
  }
  .map {
    display: flex;
    .el-input {
      margin-right: 10px;
    }
  }
}
</style>
